<template>
  <div class="aa">
    <div class="daohangtitle">AA组件</div>
    <div class="mainbox">
      <div class="sur">商城概况</div>
      <div class="sura">
        <div class="surai" v-for="item in 3" :key="item">1002</div>
      </div>
      <div class="sur">核心数据</div>
    </div>
  </div>
</template>

<script>
export default {
}
</script>

<style scoped>
.aa {width: 100%;height: 100%;background: #Fff;padding-left: 20px;box-sizing: border-box;}
.daohangtitle {height: 30px;font-size: 12px;background: #eee;margin-left: -20px;}
.sur {margin-top: 20px;position: relative;padding-left: 10px;font-size: 20px;line-height: 1;}
.sur:before {content: '';width: 5px;height: 25px;background: red;position: absolute;left: 0;top: 0;border-radius: 5px;}
.sura {width: 100%;display: flex;justify-content: space-between;align-items: center;margin-top: 30px;}
.surai {width: 30%;height: 125px;line-height: 125px;text-align: center;background: #eee;border-radius: 10px;color: #666;margin-right: 20px;}
</style>